<template>
  <div>
    {{ name }} 今年已经 {{ age }}岁了
    <button @click="age++">过了一年</button>
  </div>
</template>

<script setup>
import { reactive, toRefs } from 'vue';

// 创建响应式对象
const student = reactive({
  name: 'tom',
  age: 17
})

// 直接解构数据会丢失响应式功能
// const { name, age } = student
const { name, age } = toRefs(student)

</script>
